<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="A layout example with a side menu that hides on mobile, just like the Pure website.">
    <title>Bookdown</title>
    <link rel="stylesheet" href="/css/pure-min.css"> <!--https://unpkg.com/purecss@0.6.0/build/pure-min.css-->
    <link rel="stylesheet" href="/katex/katex.min.css"> <!--https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.css-->
    <link rel="stylesheet" href="/main.css">
</head>
<body onload='load("{{{book.book}}}", "{{{file.file}}}")'>

<script src="/bookdown.js"></script>

<div class="header pure-menu pure-menu-horizontal">
  <ul class="pure-menu-list">
    <li class="pure-menu-item"><a href="README.md" class="pure-menu-link">{{{book.title}}}</a></li>
    <input id="searchQuery" type="text" placeholder=" search" size="10" style="border-radius: 5px;">
    <li class="pure-menu-item pure-menu-has-children pure-menu-allow-hover">
      <a href="#" id="menuLink1" class="pure-menu-link">Editor</a>
      <ul class="pure-menu-children">
        <li class="pure-menu-item"><a onclick="view()" class="pure-menu-link">View</a></li>
        <li class="pure-menu-item"><a onclick="edit()" class="pure-menu-link">Edit</a></li>
        <li class="pure-menu-item"><a onclick="save()" class="pure-menu-link">Save</a></li>
        <li class="pure-menu-item"><a href="book.json" class="pure-menu-link">Book</a></li>
        <li class="pure-menu-item"><a href="/view/home/login.md" class="pure-menu-link">Login</a></li>
        <li class="pure-menu-item"><a onclick="logout()" class="pure-menu-link">Logout</a></li>
      </ul>
    </li>    
  </ul>
</div>

<div id="layout">
  <a href="#menu" id="menuLink" class="menu-link"><span></span></a>
  <div id="menu">
    <div class="pure-menu">
      <a class="pure-menu-heading" href="/">BOOKDOWN</a>
      <ul class="pure-menu-list">
        {{#book.parts}}
        <li class="pure-menu-item"><a href="{{{link}}}" class="pure-menu-link">{{{title}}}</a></li>
        {{/book.parts}}
      </ul>
    </div>
  </div>

  <div id="main">
    <div class="content" id="viewBox">
      {{{file.html}}}
    </div>
    <div class="content" id="editBox">
      <br/>
      <textarea id="editText" name="editText">{{{file.text}}}</textarea>
    </div>
    <div class="content" id="searchBox">
    </div>
  </div>
</div>
<script src="/js/ui.js"></script>
<script src="/js/showdown.min.js"></script>
<script src="/katex/katex.min.js"></script> <!-- https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.js -->
<script src="/js/marked.js"></script>
</body>
</html>
